<template>
  <div class="PayMoney">
    <van-nav-bar
        title="订单详情"
        left-text=""
        @click-left="onClickLeft"
        left-arrow
    />
    <div class="top">
      <div class="left">
        <van-card
            num="1"
            :price="payMoney.money"
            desc="描述信息"
            title="会员"
            thumb="https://img01.yzcdn.cn/vant/ipad.jpeg"
        >
        </van-card>
      </div>
      <div class="right"></div>
    </div>
    <div class="bottom">
      <van-submit-bar
          :price="payMoney.money * num"
          button-text="立即支付"
          @submit="onSubmit"
      />
    </div>
  </div>
</template>

<script>
import {mapActions, mapGetters} from 'vuex'

export default {
  name: "PayMoney",
  computed: {
    ...mapGetters(['loginUserInfo','userPhone'])
  },
  data() {
    return {
      payMoney: this.$route.query.payList,
      num: 100,
      phone: ''
    };
  },
  mounted() {
    this.phone = this.loginUserInfo.phone
  },
  methods: {
    ...mapActions(['setUserMoney']),
    onClickLeft() {
      this.$router.push("/MyMessage");
    },
    onSubmit() {
      this.$dialog
          .confirm({
            title: "确认支付",
            message: "请确认订单详情并支付",
          })
          .then(() => {
            this.setUserMoney(this.payMoney.money);
            this.$router.push("/MyMessage");
            // this.$service.myService.payMoney(this.userPhone, this.payMoney.money, this.payMoney.day).then(res => {
            // })
            // on confirm
          })
          .catch(() => {
            // on cancel
          });
    },
  },
};
</script>

<style>
</style>
